SVG #3 curve with path and c
1 Drawing a straight line with&path>element
<path d="M 0 0 L 10 10 Z" stroke="black" fill="none"/>
There must be d attribute.
-M is moving to
-L is line to
-Z is end
2 Drawing disconnected lines
<path d="M 0 0 L 10 10 M 30 5 L 30 0 Z" stroke="black" fill="none"/>
We can use M again to move to another point to start another line segment.
3 Drawing a curve
<path d="M 10 40 C 10 50 40 50 40 40 Z" stroke="black" fill="none"/>
Use C for curve
C takes four pairs of coordinates
Point-Start C Control-One Control-Two Point-End